<template>
  <div id="app" class="f-cb">
    <div class="AppLanguage">
      <span @click="languageChange('zh-CN')" :class="lang=='zh-CN'?'hover':''">简</span>　|　
      <span @click="languageChange('zh-TW')" :class="lang=='zh-TW'?'hover':''">繁</span>　|　
      <span @click="languageChange('en')" :class="lang=='en'?'hover':''">EN</span>
    </div>
    <div class="PcLogo" v-if="bottom.terminal">
      <img :src="bottom.terminal.terminalLogo" alt="">
    </div>
    <router-view v-if="isRouterAlive" />
    <div class="loginBottomFonts f-cb">
      {{bottom.about}}
      <p>Based on LinkAOS  <a href="http://linksoft.cn/" target="_blank">©LINKSOFT</a></p>
    </div>
    
  </div>
</template>

<script>
export default {
  name: "App",
  data(){
    return{
      lang:sessionStorage.getItem('lang'),
      bottom:"",
      isRouterAlive:true,
    };
  },
  created() {},
  mounted(){
    console.log(navigator.userAgent)
    if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
        //window.location.href = "http://vicoaccount.com/";
    }
    this.about();
    this.$nextTick(function(){
      if(this.lang == 'en'){
        $('#app').addClass('English');
      }else{
        $('#app').removeClass('English');
      }
    })
  },
  methods: {
    languageChange(lang){
      var _this = this;
      sessionStorage.setItem('lang',lang)
      this.lang = lang
      this.$i18n.locale = lang
      this.$router.go(0)
    },
    about(){
      var _this = this;
      this.$axios.get('/common/about')
      .then(res => {
          if(res.data.code == 1){
            this.bottom =res.data.data
            var link = document.head.querySelector("link");
            link.href = res.data.data.terminal.terminalIcon;
          }else{
            _this.$message({
                message: res.data.msg,
                type: "warning"
            });
          }
          
      })
      .catch(function(error) {
          console.log(error)
      })
    },
  },
  watch:{
    '$route':{
      handler(newRouter,oldRouter){
        var _this = this;
        //console.log(newRouter,oldRouter,'Router')
        this.$nextTick(function(){
          if(newRouter.name == oldRouter.name){
            this.$router.go(0)
          }
          if(!sessionStorage.getItem("token")){
              this.$router.replace({path:'/'})
          }
          if(newRouter.fullPath=="/"){
            sessionStorage.clear()
            sessionStorage.setItem('lang',this.lang)
          }
          if(newRouter.fullPath!="/download"){
            $('#app').removeClass('download_bg');
          }
        })
      },
      immediate: true
    }
  }
};
</script>
<style lang="less">
  #app {
    font-family: "Avenir", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: @fff;
    padding:30px 40px;

    .AppLanguage{
      text-align: right;
      font-size: 14px;
      line-height: 34px;
      color: @b0b0b2;
      span{
        cursor: pointer;
      }
      span:hover,span.hover{
        color: @hoverColor;
      }
    }
    .PcLogo{
      width: 100%;
      margin: 80px 0 26px;
      text-align: center;
      line-height:62px;
      height: 62px;
      img{
        max-height: 62px;
        max-width: 194px;
      }
    }
    .loginBottomFonts{
      font-size: 12px;
      color: @titleColor;
      line-height: 32px;
      text-align: center;
      padding-top: 94px;
      span{
          color: @hoverColor;
      }
    }
  }
</style>
